<template>
  <div id="app">
    <!-- <img src="./assets/logo.png"> -->
    <!-- <router-view/> -->
    <!-- <input v-model="message" placeholder="编辑">
        <p>message 是：{{ message }}</p>
        <el-input v-model="message" placeholder="请输入内容"></el-input>
        <div class="block">
          <span class="demonstration">默认不区分颜色</span>
          <el-rate v-model="value1"></el-rate>
        </div> -->
    <el-table :data="tableData" style="width: 100%">
      <el-table-column prop="title" label="标题">
      </el-table-column>
      <el-table-column prop="content" label="内容" >
      </el-table-column>
      <el-table-column prop="link" label="链接">
      </el-table-column>
      <el-table-column prop="pubdate" label="发布时间">
      </el-table-column>
      <el-table-column prop="copyright" label="版权方">
      </el-table-column>
      <el-table-column label="操作">
        <template slot-scope="scope">
          <el-button
            size="mini"
            @click="handleEdit(scope.$index, scope.row)">编辑</el-button>
          <el-button
            size="mini"
            type="danger"
            @click="handleDelete(scope.$index, scope.row)">删除</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
  export default {
    name: 'App',
    data() {
      return {
        // message: 'Welcome to Your Vue.js App',
        // value1: null,

        tableData: null
        // tableData: [{
        //   title: 'EasyPoi 3.3.0 发布，可能是最后一个支持 JDK 6/7 的版本',
        //   content: '此次更新内容：重点是 多层导出支持版本 支持N层导出了 支持国际化接口 修复了$fe的bug 删除了缓存,自己实现吧',
        //   link: 'https://www.oschina.net/news/100326/easypoi-3-3-0-released',
        //   pubdate: '2018-09-25T15:00:00.000Z',
        //   copyright: 'osc'
        // }, {
        //   title: 'EasyPoi 3.3.0 发布，可能是最后一个支持 JDK 6/7 的版本',
        //   content: '此次更新内容：重点是 多层导出支持版本 支持N层导出了 支持国际化接口 修复了$fe的bug 删除了缓存,自己实现吧',
        //   link: 'https://www.oschina.net/news/100326/easypoi-3-3-0-released',
        //   pubdate: '2018-09-25T15:00:00.000Z',
        //   copyright: 'osc'
        // }]
      }
    },
    mounted() {
      this.axios.post("http://api.komavideo.com/news/list").then(body => {
        this.tableData = body.data;
      });
    }
  }
</script>

<style>
  #app {
    font-family: 'Avenir', Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-align: center;
    color: #2c3e50;
    margin-top: 60px;
  }
</style>
